<template>
  <div class="flex justify-between items-center mb-4">
    <h2 class="text-xl font-bold">课程管理</h2>
    <div>
      <el-button type="primary" @click="showAddCourseDialog">
        添加课程
      </el-button>
    </div>
  </div>
  <ProjectTable :data="courseList" />
  <!-- 添加/编辑课程对话框 -->
  <ProjectDialog
    v-model="courseDialogVisible"
    :project="project"
    @cancel="courseDialogVisible = false"
    @save="saveProject"
    @upload="handleUploadProject"
  />
</template>
<script lang="ts" setup>
import { useProject } from "../composables/useProject";
import ProjectTable from "./ProjectTable.vue";
import ProjectDialog from "./ProjectDialog.vue";
import { useUserStore } from "../../../store/user";

const {
  courseList,
  project,
  saveProject,
  handleUploadProject,
  courseDialogVisible,
  getCourseList,
} = useProject();
const userStore = useUserStore();
getCourseList(userStore.userInfo.value.id);

// 课程管理方法
function showAddCourseDialog() {
  courseDialogVisible.value = true;
}
</script>
<style scoped lang="scss"></style>
